<!--  -->
<template>
  <div>
     <el-table
    :data="tableData"
    stripe
    style="width: 100%">
    <el-table-column
      prop="bookname"
      label="书名"
      width="1000"
    >
       <template slot-scope="scope">
       
        <a>{{ scope.row.bookname }}</a>
      </template>
    </el-table-column>
 
     <el-table-column
      prop="address"
      label="操作">
       <template slot-scope="scope">
       
       <i class="down" @click="down(scope.row)"></i>
       <i class="read" @click="read(scope.row)"></i>
      </template>
    </el-table-column>
  </el-table>
    <onlinereadProgress ref="onlinereadref"   />
  </div>
</template>
<script>
import onlinereadProgress  from '@/views/common/onlinereadProgress.vue'

export default {
  name:'',
  components: {onlinereadProgress},
  props:['tableData'],
  data() {
      return {
  
        }
        },
  computed: {},
  watch: {},
  created() {},
  mounted(){},
  methods: {
     down(row) {
      window.location.href =window.SITE_CONFIG.baseUrl+"/searchbook/downloadwx?digitfilename="+ row.digitfilename+"&bookname="+row.bookname;
  },
  read(row){
     this.$refs.onlinereadref.onlinereadProgress(row.filename,row.书名)
  }
}
}

</script>
<style lang='css' scoped>
.down {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(../../assets/img/kns8-icon-sprite.png);
    background-repeat: no-repeat;
    background-position: 0px -140px;
    float: left;
    cursor: pointer;
}
.read {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(../../assets/img/kns8-icon-sprite.png);
    background-repeat: no-repeat;
    background-position: -20px -140px;
     float: left;
     cursor: pointer;
}
.cell a{

  cursor: pointer;
}

 a:focus, a:hover {
    color: rgb(76, 122, 179);
    text-decoration: none;
}
</style>